@import '~@/assets/style/variable'

.blog
  ::selection
    color #fff
    text-shadow none
    background #0085a1
  @media screen and (max-width: $smallviewwidth)
    background-color #fff
    padding 16px
    overflow-x hidden
:global
  :local(.blog)
    hr
      margin-top 20px
      margin-bottom 20px
      height 1px
      border 0
      background-color #eee
    header
      > h1
        margin-top 0
        @media screen and (max-width: $smallviewwidth)
          font-size 20px
          line-height 22px
          margin-bottom 0
    .markdown-body
      a
        color: #ce2323
        &:hover
          text-decoration underline
      p
        letter-spacing .1px
        line-height 1.5
        margin-top 20px
        margin-bottom 20px
        font-size 15px
        @media screen and (max-width: $smallviewwidth)
          margin-top 12px
          margin-bottom 12px
    .post-meta
      text-align right
      > a
        color #ce2323
        &:hover
          text-decoration underline
      > time
        display inline-block
        margin-top 10px
      > .reward
        color #ce2323
        position relative
        margin-top 15px
        > span
          cursor pointer
          margin-left 20px
          color #ce2323
        > p
          &:hover
            text-decoration underline
        > .qrcode-wrap
          position absolute
          right 0
          bottom 120px
          padding 20px
          border-radius 20px
          background-color #f5f5f5
          border 1px solid #eee
          > img
            width 200px
            height auto
            border 3px solid rgba(0,0,0,.12)
            border-radius 20px
            background-color #fff
            & + img
              margin-left 20px
          &.hide
            display none
            
